<template>
	<view>
		<u-gap></u-gap>
		<h2 class="flexflex justify-center text-center">
			{{graph.deviceName ||  '设备名'}}
		</h2>
				<u-gap></u-gap>
		
		<u-button @click="timeChange" type="primary" circle>
			时间选择
		</u-button>
		
		<u-gap></u-gap>
		
		<view class="" v-if="!showCanvas">
			<!-- :style="!showCanvas?'display:none':''" -->
			<qiun-data-charts type="column"    :chartData="chartData1" />
		</view>
		
		<u-gap></u-gap>


		<view class="" v-if="!showCanvas">
			<!-- :style="!showCanvas?'display:none':''"  -->
			<qiun-data-charts type="column"    force-use-old-canvas=“false” :chartData="chartData2" />
		</view>
		
		
		<!--  -->
		<u-calendar
		title="服务日期"
		   :defaultDate="calendar.defaultDate"
		      :maxDate="calendar.maxDate"
		      :minDate="calendar.minDate"
		      :monthNum="calendar.monthNum"
		:show="show" 
		@confirm="confirm" 
		@close="close"
		></u-calendar>
		
		
		

	</view>
</template>

<script>
	import {
		staticDayWeight
	} from '@/api/statics/statics.js'
	export default {
		data() {
			return {
				form: null,
				time: new Date(),
				graph: null,
				/*  */
				show: false,
				/*  */
				showCanvas: false,
				
				/*  */
				chartData1: {},
				chartData2: {},
				/*  */
				calendar: {
				        minDate: '',
				        maxDate: '',
				        defaultDate: '',
				        monthNum: 13,
				},
			};
		},
		// watch: {
		// 	show(newValue, oldValue){
		// 		this.showCanvas = !newValue
		// 	},
		// },
		methods: {
			async getList(time='') {
				let parm = {
					beginTime: time,
					deviceId: this.form.deviceId
				}
				let re = await staticDayWeight(parm)
				console.log(re, "re")
				this.graph = re.data
			},
			// chooseTimed() {
			//       let date = new Date();
			//       let year = date.getFullYear();
			//       let month = date.getMonth() + 1;
			//       let day = date.getDate();
			//       if (month <= 9) {
			//         month = '0' + month;
			//       }
			//       if (day <= 9) {
			//         day = '0' + day;
			//       }
			//       let minyear = year - 1;
			//       this.calendar.minDate = minyear + '-' + month + '-' + day;
			//       this.calendar.maxDate = year + '-' + month + '-' + day;
			//       this.calendar.defaultDate = year + '-' + month + '-' + day;
			//     },
			    // 选择当前一个月之内的数据
			chooseTimed() {
			      let date = new Date();
			      let year = date.getFullYear();
			      let month = String(date.getMonth() + 1);
			      let day = String(date.getDate());
			      month = month.padStart(2, '0');
			      day = day.padStart(2, '0');
			      this.calendar.maxDate = year + '-' + month + '-' + day;
			      this.calendar.defaultDate = year + '-' + month + '-' + day;
			
			      let nowTime = date.getTime();
			      let preTime = nowTime - 30 * 24 * 60 * 60 * 1000;
			      let preDate = new Date(preTime);
			      let preYear = preDate.getFullYear();
			      let preMonth = String(preDate.getMonth() + 1);
			      let preDay = String(preDate.getDate());
			      preMonth = preMonth.padStart(2, '0');
			      preDay = preDay.padStart(2, '0');
			      this.calendar.minDate = preYear + '-' + preMonth + '-' + preDay;
			    },
			
			/*  */
			timeChange(){
				this.show = true
				this.showCanvas = true
				
			},
			/*  */
			close() {
				this.show = false
				this.showCanvas = false
			},
			confirm(e) {
				console.log(e, "e")
				let time = e[0]
				console.log(time,"time")
				/*  */
				this.show = false
				
				this.showCanvas = false
				
				/*  */
				// this.Showhiddenunits = true,
				
				
				this.getList(time)
			},
			getServerData1() {
				//模拟从服务器获取数据时的延时
				setTimeout(() => {
					let res = {
						categories: this.graph.bucketNameList,
						series: [{
							name: "换桶次数",
							data: this.graph.chanceBarrelList
						}]
					};
					this.chartData1 = JSON.parse(JSON.stringify(res));
				}, 500);
			},
			getServerData2() {
				//模拟从服务器获取数据时的延时
				setTimeout(() => {
					let res = {
						categories: this.graph.bucketNameList,
						series: [{
							name: "桶重量",
							data: this.graph.weightList
						}]
					};
					this.chartData2 = JSON.parse(JSON.stringify(res));
				}, 500);
			},
		},
		onReady() {

		},
		onLoad(options) {
			if (options.data) {
				let val = JSON.parse(decodeURIComponent(options.data))
				console.log(val, "val");
				this.form = val
			}
		},
		onShow() {
			/*  */
			this.getList()
			
			/*  */
			this.chooseTimed()
			
			
			/*  */
			this.getServerData1();
			this.getServerData2();
			
		}
	}
</script>

<style lang="scss">

</style>